<template lang="html">
  <div class="ad_swiper">
    <van-swipe :autoplay="3000" indicator-color="#FFFFFF">
      <van-swipe-item v-for="(item, index) in adlist" :key="index">
        <img v-bind:src="item[imgUrl]" @click="adClick(item)" v-bind:style="{height: height * 36 / 7500 + 'rem', width: '100%'}"/>
      </van-swipe-item>
    </van-swipe>
  </div>
</template>

<script>
export default {
  props: {
    position: {
      type: String,
      required: true
    },
    height: {
      type: Number
    }
  },
  data () {
    return {
      adlist: [],
      counter: this.$props.position,
      imgUrl: ''
    }
  },
  created () {
    switch (this.position) {
      case 'HOME1_BANNER':
        this.imgUrl = 'home_banner1_url'
        break
      case 'HOME2_BANNER':
        this.imgUrl = 'home_banner2_url'
        break
      case 'MY_BANNER':
        this.imgUrl = 'my_url'
        break
      case 'ACCOUNT_BANNER':
        this.imgUrl = 'account_url'
    }
    this.getAdlist()
  },
  methods: {
    adClick (item) {
      return new Promise((resolve, reject) => {
        this.$Axios({ url: 'banner_count', data: { position: this.position, click_channel: 'h5', banner_id: item.id, click_count: 1 }, method: 'post' }).then((resp) => { // 请求成功
          if (item.h5_link) window.location = item.h5_link
          resolve(resp)
        }).catch((error) => { // 请求失败
          if (item.h5_link) window.location = item.h5_link
          reject(error)
        })
      })
    },
    getAdlist () {
      return new Promise((resolve, reject) => {
        this.$Axios({ url: 'banner', params: { position: this.position, type: 'h5' }, method: 'get' }).then((resp) => { // 请求成功
          if (resp.return_code === '0000') {
            this.adlist = resp.data.list
          }
          resolve(resp)
        }).catch((error) => { // 请求失败
          this.$_requestInterceptor('error', error)
          reject(error)
        })
      })
    }
  }
}
</script>

<style lang="css" scoped>
</style>
